
import React, { Component } from 'react'
import { Modal, Button, Input, Row, Col, Form, message } from 'antd';
import { connect } from 'dva';
import BaseComponent from '@/components/BaseComponent';


@connect(({ user }) => ({
    // data: risk.riskData,
    currentUser: user.currentUser,
}))
class index extends BaseComponent {

    constructor(props) {
        super(props)
        this.state = {
            visible: false,
            form: {
            },

        }
    }

    showModal = () => {
        this.setState({
            visible: true,
        });
    };

    handleOk = e => {
        e.preventDefault();
        this.props.form.validateFields((err, values) => {
            if (!err) {
                this.DeleteDataById()
                this.handleCancel()
            }
        });
    };

    handleCancel = () => {
        this.props.form.resetFields();
        this.setState({
            visible: false,
            form: {},
        });
    };

    errorMessageChange = (e) => {
        const {value} = e.target;
        this.setState((params) => ({
            form: {
                ...params.form,
                errorMessage: value
            }
        }));
    }

    // 回退
    DeleteDataById = () => {
        this.execHttp('followUpFormalDatabase/followUpListOfficeReturn',
            {
                id: this.props.record.id, followUpListId: this.props.record.follow_up_list_id,
                errorMessage: this.state.form.errorMessage
            }).then(resp => {
                if (resp.success) {
                    message.success(resp.message);
                    this.props.getDataByPage({})
                }
            });
    }

    render() {
        const formItemLayout = {
            labelCol: {
                xs: { span: 24 },
                sm: { span: 4 },
            },
        };
        const { getFieldDecorator } = this.props.form;

        return (
          <div style={{ display: "inline-block" }}>
            <Button type="primary" style={{ marginLeft: "10px" }} onClick={this.showModal}>
              回退
            </Button>

            <Modal
              title="回退原因"
              visible={this.state.visible}
              onOk={this.handleOk}
              onCancel={this.handleCancel}
            >

              <Form {...formItemLayout}>
                <Row gutter={16}>
                  <Col span={24}>
                    <Form.Item label="回退说明">
                      {getFieldDecorator('errorMessage', {
                                        rules: [{ required: true, message: '回退说明不能为空' }],
                                    })(
                                      <Input
                                        placeholder="回退说明"
                                        value={this.state.form.errorMessage}
                                        onChange={this.errorMessageChange}
                                        style={{ width: 300 }}
                                      />
                                    )}
                    </Form.Item>
                  </Col>
                </Row>

              </Form>

            </Modal>


          </div>
        )
    }
}
const WrappedMyForm = Form.create()(index);

export default WrappedMyForm;